<template>
  <DataCollectTable :data="data" :total="total" :config="config" @operationsHander="opHander.receive">
  </DataCollectTable>
</template>
<script setup>
import DataCollectTable from "@com/table/DataCollectTable.vue";
import { ref, defineProps, defineEmits } from "vue";
import {
  OP_KEY,
  COLUMN_TYPE,
  OPERATIONS,
  operationsHander,
} from "@com/table/tableOperations";
import { $msg, $box } from "@ui/msg";
import api from "@api/member"
import useRoute from "@util/router";

const emit = defineEmits(['getNum'])

const props = defineProps({
  type: {
    type: String
  }
})

const route = useRoute();

route.watchRouter(props.type, () => { getData() })

const data = ref([]);
const total = ref(0);

function memberOperations(data) {
  if (props.type === 'membermanager') {
    // 1009001 普通会员、 1009002 分销会员
    if (data.memberType === '1009001') {
      return [OPERATIONS.check, OPERATIONS.orderRecord, OPERATIONS.convertDistr];
    } else {
      return [OPERATIONS.check, OPERATIONS.orderRecord];
    }
  } else {
    return [OPERATIONS.check, OPERATIONS.unbindDistr];
  }
}

const config = {
  showIndex: true,
  operations: {
    label: "操作",
    width: 120,
    operations: memberOperations,
  },
  column: [
    {
      label: "头像",
      prop: "avatar",
      type: COLUMN_TYPE.picture,
      width: 100,
    },
    {
      label: "姓名",
      prop: "nickname",
    },
    {
      label: "账号",
      prop: "loginName",
      width: 150,
    },
    {
      label: "会员状态",
      prop: "memberStatus",
      width: 110,
      type: COLUMN_TYPE.switch,
      operationsKey: OPERATIONS.switch,
      activeText: "正常",
      inactiveText: "封禁",
      activeValue: "1030001", // 1030001 正常、 1030002 封禁
      inactiveValue: "1030002",
      switchWidth: 55,
    },
    {
      label: "性别",
      prop: "gender",
      width: 80,
    },
    {
      label: "累计消费（元）",
      prop: "totalPayMoney",
      width: 125,
    },
    {
      label: "会员积分",
      prop: "rewardPoints",
      width: 100,
    },
    {
      label: "储值余额",
      prop: "depositMoney",
      width: 100,
      type: COLUMN_TYPE.depositMoney,
      operationsKey: OPERATIONS.depositMoney
    },
    {
      label: "冻结余额",
      prop: "freezeMoney",
      width: 100,
      type: COLUMN_TYPE.freezeMoney,
      operationsKey: OPERATIONS.freezeMoney
    },
    {
      label: "创建时间",
      prop: "createTime",
      width: 180,
    },
  ],
};

if (props.type == 'distributormanager') {
  config.column.splice(5, 3)
}

const opHander = operationsHander();
opHander.install(OP_KEY.check, (data) => {
  if (props.type === 'membermanager') {
    route.push({ name: "memberdetails", query: { code: data.memberCode } });
  } else {
    route.push({ name: "distributordetails", query: { code: data.memberCode } });
  }
});

opHander.install(OP_KEY.orderRecord, (data) => {
  route.push({ name: "membergoodsorder", query: { login: data.loginName } });
});

opHander.install(OP_KEY.convertDistr, (data) => {
  $box.open("转为分销员确认", `是否将${data.loginName}转为分销员`, () => {
    api.up(data.memberCode, () => {
      $msg.succ("转为分销员成功");
      getData()
      emit('getNum')
    }, () => {
      $msg.succ("转为分销员失败");
    })
  });
});

opHander.install(OP_KEY.unbindDistr, (data) => {
  $box.open("解除分销员确认", `是否将${data.loginName}解除分销员`, () => {
    api.unbindDistr(data.memberCode, () => {
      $msg.succ("解除分销员成功");
      getData()
      emit('getNum')
    }, () => {
      $msg.succ("解除分销员失败");
    })
  });
});

opHander.install(OP_KEY.switch, (data) => {
  // 1030001 正常、 1030002 封禁
  let status = data.data.memberStatus == "1030001" ? "1030002" : "1030001"
  api.status(data.data.memberCode, status, () => {
    data.resolve(true)
    $msg.succ("用户状态修改成功");
    getData()
  }, () => {
    data.reject()
  })
});

opHander.install(OP_KEY.depositMoney, (data) => {
  route.push({ name: "deposittabledetails", query: { code: data.memberCode, type: '1048001' } });
});

opHander.install(OP_KEY.freezeMoney, (data) => {
  route.push({ name: "deposittabledetails", query: { code: data.memberCode, type: '1048002' } });
});

getData()
function getData() {
  let routeQuery = route.query()
  api.list(props.type, {
    loginName: routeQuery.login,
    nickname: routeQuery.name,
    memberStatus: routeQuery.status,
    page: routeQuery.p,
    size: routeQuery.s
  }, val => {
    total.value = val.total
    data.value = val.list
  })
}
</script>
